<%@ include file="/WEB-INF/common/taglibs.jsp"%>
<script type="text/javascript"> 
var topic='';
$(document).ready(function(){	
	$("#table_topics").tableSorter({
		sortClassAsc: 'headerSortUp',
		sortClassDesc: 'headerSortDown',
		headerClass: 'header',
		disableHeader: 0
	}).tableEditor({
		EDIT_HTML: 'Edit',
		SAVE_HTML: 'Save',
		FUNC_PRE_EDIT: 'preEdit',
		FUNC_PRE_SAVE: 'preSave',
		FUNC_UPDATE: 'updateObj'
	});

	$('#addTopic').click(function() {
		var options = {
			CLASS: 'newRow', 
			VALUES: {
				linkQuantity: '0',
				enabled: 'true'
			}
		};
		jQuery.tableEditor.lib.appendRow(options);
	});
});
function preEdit(o){
}
function preSave(o){
	topic='';
	o.row.find("input").each(function(){
		topic += $(this).val()+"-,-";
	}).end();
}
function updateObj(o){
	$.ajax({
		url: '/ajax/admin/updateTopic.do?topic=' + topic,
		type: 'POST',
		timeout: 10000,
		error: function(){alert('update failed!');},
		success: function(){}
	});
}
function deleteTopic(id){
	$.ajax({
		url: '/ajax/admin/deleteTopic.do?id=' + id,
		type: 'POST',
		timeout: 10000,
		error: function(){alert('delete failed!');},
		success: function(){}
	});
}
</script>
<button id="addTopic">Add New Topic</button>
<div class="pageMenu"><c:if test="${param.pageIndex gt 0}">
	<a
		href="<c:url value="/admin/topics.do?pageIndex=${param.pageIndex-1}&pageSize=${param.pageSize}"/>">Previous&nbsp;Page</a>
</c:if>&nbsp;&nbsp;<a
	href="<c:url value="/admin/topics.do?pageIndex=${param.pageIndex+1}&pageSize=${param.pageSize}"/>">Next&nbsp;Page</a></div>
<table align="center" id="table_topics">
	<thead>
		<tr>
			<th name="id">Id</th>
			<th name="name" style="width: 200px;">Name</th>
			<th name="author">Author</th>
			<th name="linkQuantity">Link Quantity</th>
			<th name="enabled">Enabled</th>
			<th>Action</th>
		</tr>
	</thead>
	<tbody>
		<c:forEach var="topic" items="${topics}">
			<tr>
				<td>${topic.id}</td>
				<td>${topic.name}</td>
				<td>${topic.author}</td>
				<td>${topic.linkQuantity}</td>
				<td>${topic.enabled}</td>
				<td><a href="#" class="tsEditLink">Edit</a>&nbsp;<a href="#"
					onclick="deleteTopic('${topic.id}')">Delete</a></td>
			</tr>
		</c:forEach>
	</tbody>
</table>
<div class="pageMenu"><c:if test="${param.pageIndex gt 0}">
	<a
		href="<c:url value="/admin/topics.do?pageIndex=${param.pageIndex-1}&pageSize=${param.pageSize}"/>">Previous&nbsp;Page</a>
</c:if>&nbsp;&nbsp;<a
	href="<c:url value="/admin/topics.do?pageIndex=${param.pageIndex+1}&pageSize=${param.pageSize}"/>">Next&nbsp;Page</a></div>